<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="UTF-8">
  <title>存款操作</title>
  <style>
    body { font-family: Arial, sans-serif; margin: 30px; max-width: 600px; margin: 0 auto; padding: 20px; }
    .nav { margin: 20px 0; padding-bottom: 10px; border-bottom: 1px solid #eee; }
    .nav a { margin-right: 15px; text-decoration: none; color: #0066cc; }
    .nav a:hover { text-decoration: underline; }
    form { margin-top: 20px; background: #f9f9f9; padding: 20px; border-radius: 8px; }
    label { display: block; margin: 15px 0 5px; font-weight: bold; }
    input, select { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; box-sizing: border-box; }
    button { margin-top: 20px; padding: 10px 20px; background: #0066cc; color: white; border: none; border-radius: 4px; cursor: pointer; }
    button:hover { background: #0052a3; }
  </style>
</head>
<body>
<div class="nav">
  <a href="UserHome.html">返回主页</a>
</div>
<h2>存款操作</h2>

<form id="depositForm" method="post" action="/deposit">
  <label>输入账号：</label>
  <input type="text" name="accountId" placeholder="请输入账号" required>

  <label>存款金额：</label>
  <input type="number" step="0.01" name="amount" placeholder="请输入金额" required min="0.01">

  <label>备注：</label>
  <input type="text" name="remark" placeholder="请输入备注">

  <button type="submit">确认存款</button>
</form>

<script>
  document.getElementById('depositForm').addEventListener('submit', function (e) {
    e.preventDefault();
    const formData = new FormData(this);
    fetch('/deposit', {
      method: 'POST',
      body: formData
    })
    .then(response => response.text())
    .then(data => {
      if (data.includes('存款成功')) {
        window.location.href = 'depositSuccess.html';
      } else {
        alert(data);
      }
    })
    .catch(error => {
      alert('请求出错：' + error.message);
    });
  });
</script>
</body>
</html>
